<div class="row animate fadeIn">
    <form id="addMod" class="form-horizontal"  method="post">
        <div class="ibox-title" style="border:none;"><h5 style="color: #00afef"><i>Add Module</i></h5>
            <div class="ibox-tools">
                <button  id="sads" class="btn btn-sm btn-primary save-btn-tab">Save</button>
                <a id = "cancel_add" class="btn btn-sm btn-outline btn-info cancel-btn-tab">Cancel</a>
            </div>
        </div>
        <div class="ibox-content">
            <div class="form-group"><label class="col-lg-3 control-label">Code</label>
                <div class="col-lg-10 input-s">
                    <input type="text" name = "moduleCode" class="form-control">
                </div>
            </div>
            <div class="form-group"><label class="col-lg-3 control-label">Name</label>
                <div class="col-lg-11 input-s">
                    <input type="text" name="moduleName" class="form-control">
                </div>
            </div>
            <div class="form-group"><label class="col-lg-3 control-label">Directory Path</label>
                <div class="col-lg-11 input-s">
                    <input type="text" name="moduleDir" class="form-control">
                </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Enabled</label>
                <div class="col-lg-10 input-s">
                    <input type="checkbox" name="enableBox" value="ok" class="i-checks" checked>
                </div>
            </div>
    </form>
            <div id="addModMenu">
                <div id="addpGroup" class="ibox-content">
                    <h3>Add Module Menu</h3>
                    <form  id="module-menu-form" class="form-inline">
                        <input type="hidden" id="module-id" name="module-id">
                        <div class="form-group">
                          <div class="col-lg-10 input-s">
                            <input type="text" id="ipgName" name="menu_name" class="form-control">
                          </div>
                          <div class="col-lg-10 input-s">
                            <button class="btn btn-white" id="gana"><i class="fa fa-plus success"></i></button>
                          </div>
                        </div>
                    </form><br>
                    <table id="pgTable"class="table table-bordered" style="width:70%;">
                        <thead>
                            <tr>
                                <th>Module Menu</th>
                                <!-- <th>Action</th> -->
                            </tr>
                        </thead>
                        <tbody id="tbodydaw" class="animate fadeIn">
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
</div>
      <script>
            $(document).ready(function () {
                var mID;
                $('#forms').hide();
                // $('#addpGroup').hide();
                $('#addModMenu').hide();
                var counter = 0;
              $('#aPG').click(function(){
                $(this).hide();
                if(counter == 0){
                $('#forms').show();
                counter = counter+1;
                }
              });

              $('.i-checks').iCheck({
                    checkboxClass: 'icheckbox_square-green',
                    radioClass: 'iradio_square-green',
              });

               $("#module-menu-form").validate({
                rules:{
                  menu_name: {
                      required: true,
                      lettersonly: true
                  }
                },
                submitHandler: function(form){
                    console.log('clicked!');
                $('#tbodydaw').empty();
                var modulename = $('#ipgName').val();
                var moduleid = $('#module-id').val();
                console.log(modulename+ ' ' + moduleid);
                    $.ajax({
                        type: "POST",
                        url: "<?php echo base_url($this->session->userdata('forajax').'/insert_module_menu'); ?>",
                        data: { "menu-name": modulename, "module-id": moduleid  },
                        dataType: 'json',
                    success: function(data){
                        console.log(data);
                        var trHTML = '';
                        notifymsg("success",". . .Menu Added Successfully");
                        $.each(data, function(i, item) {
                            // trHTML += '<tr><td>' + data[i].menu_name + '</td><td><button class="btn btn-outline btn-info">Edit</button></td></tr>';
                               trHTML += '<tr><td>' + data[i].menu_name + '</td></tr>';
                        });
                        $('#tbodydaw').append(trHTML);
                        $("#ipgName").val('');
                          }
                    });
                 }
               });

               $("#addMod").validate({
                 rules: {
                     moduleCode: {
                         required: true,
                         minlength: 2,
                         capitalonly: true
                     },
                     moduleName: {
                         required: true,
                         lettersonly: true
                     },
                     moduleDir: {
                         required: true,
                         lettersonly: true
                     }
                 },
                 submitHandler: function(form){
                    dataString = $("#addMod").serialize();
                    $.ajax({
                        type: "POST",
                        url: "<?php echo base_url($this->session->userdata('forajax').'/insert_module'); ?>",
                        data: dataString,
                        dataType: 'json',
                    success: function(data){
                           $('#module-id').val(data.modID);
                           if(data.err == 1){
                            notifymsg("danger",data.msg);
                           }else{
                           notifymsg("success",". . .New Module Added Successfully");
                           mID = data.modID; console.log(mID);
                           $('#addModMenu').show();
                           $('#addMod').find('input, button').attr('disabled','disabled');
                           $('#module-menu-form').find('input, button, checkbox').removeAttr('disabled');
                              }
                            }
                        });


                 //$('#addMod')[0].reset();
                 }
             });

                  $('#cancel_add').click(function () {
                              swal({
                                          title: "Are you sure?",
                                          text: "Your work will not be save",
                                          type: "warning",
                                          showCancelButton: true,
                                          confirmButtonColor: "#DD6B55",
                                          confirmButtonText: "Leave",
                                          cancelButtonText: "Stay",
                                          closeOnConfirm: true,
                                          closeOnCancel: true },
                                      function (isConfirm) {
                                          if (isConfirm) {
                                            swal("success");
                                              close_add(); active_search();
                                              notifymsg("hide","hide");
                                          } else {
                                              swal("Cancelled");
                                          }
                                      });
                          });

            });
        $('#addX').click(function(){
            close_add();
       });
</script>